<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./首页.css">
    <link rel="stylesheet" href="./img/font_4293894_oruzh3ymbos/iconfont.css">
</head>

<body>
    <div id="shouye">
        <div id="header">
            <p>网易云音乐</p>
        </div>
        <div id="zhong1">
            <div id="slideshow">
                <ul id="imglist">
                    <li><img src="./img/01.png" alt=""></li>
                    <li><img src="./img/02.png" alt=""></li>
                    <li><img src="./img/03.png" alt=""></li>
                    <li><img src="./img/04.png" alt=""></li>
                    <li><img src="./img/06.png" alt=""></li>
                </ul>
                <ul id="dotlist">
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>

                <button id="pre"><i class="iconfont">&#xe607;</i></button>

                <button id="next"><i class="iconfont">&#xe606;</i></button>
            </div>
            <div id="gedan">
                <p>推荐歌单</p>
                <div id="dan">
                    <img src="./img/04.png" alt="">
                    <a href="//music.163.com/outchain/player?type=2&id=1838182645&auto=1&height=66"><img
                            src="./img/04.png" alt=""></a>
                    <img src="./img/04.png" alt="">
                    <img src="./img/04.png" alt="">
                    <img src="./img/04.png" alt="">
                </div>
            </div>
        </div>
        <div id="zhong2"> 
            <p id="qiehuan">首页 | 推荐歌单页</p>
            <div id="tuijian">
                <div id="tuijian-img">
                    <img src="./img/07.png" alt="">
                </div>
                <div id="tuijian-ming">
                    <h3>一旦热爱生活，生活就会教你治愈一切的魔法</h3>
                    <div id="small"><img src="./img/07.png" alt=""> 歌单创建者,创建时间 </div>
                    <div id="bofangquanbu"> 播放全部 | + </div>
                    <p>标签 : <span>华语/流行/治愈</span></p>
                    <p>歌曲 : 30 播放 : 230W</p>
                    <p>简介 : 你一直都很可爱</p>
                </div>
            </div>

            <div id="tuijianliebiao">
                <h3>歌曲列表</h3>
                <div id="liebiao">
                    <div id="liebiaotou">
                        <span>&nbsp;</span>
                        <span>歌曲</span>
                        <span>歌手</span>
                        <span>专辑</span>
                        <span>时长</span>
                    </div>
                    <ul id="biaolist">
                        <li>
                            <div id="liebiao-biao" class="biao01">
                                <span><i class="iconfont">01&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>阿迪斯发</span>
                                <span>徐大是大非</span>
                                <span>梵蒂冈g</span>
                                <span>2：30</span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao" class="biao02">
                                <span><i class="iconfont">02&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>发生的给</span>
                                <span>俺是个 </span>
                                <span>俺是个爱似 </span>
                                <span>格瑞特 </span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao">
                                <span><i class="iconfont">03&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>发十大</span>
                                <span>得三方sd </span>
                                <span>法国法国人 </span>
                                <span>法国啊 </span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao">
                                <span><i class="iconfont">04&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>发给人情味</span>
                                <span>俺人气高微软 </span>
                                <span>如果去 </span>
                                <span>然后给你 </span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao">
                                <span><i class="iconfont">05&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>投行部你</span>
                                <span>儿童义</span>
                                <span>特邀你 </span>
                                <span>热热去 </span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao">
                                <span><i class="iconfont">06&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>同步你去吃v </span>
                                <span> 并且如果不</span>
                                <span>文化部 </span>
                                <span>让我特别去</span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao">
                                <span><i class="iconfont">07&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span>高洪波v火车</span>
                                <span>夫人好吧v </span>
                                <span>房屋过户 </span>
                                <span>耦合剂你 </span>
                            </div>
                        </li>
                        <li>
                            <div id="liebiao-biao">
                                <span><i class="iconfont">08&nbsp; &#xe600; &nbsp; &#xe62d;</i></span>
                                <span> 回家就不能</span>
                                <span>哦发表接你</span>
                                <span>我iv吧还能 </span>
                                <span>全部看见 </span>
                            </div>
                        </li>



                    </ul>
                </div>

            </div>
        </div>
        <div id="zhong3">
            <div id="ge">
                <div id="changpian">
                    <img src="./img/唱片.png" alt="">
                    <div id="changxin">
                        <img src="./img/08.png" alt="">

                    </div>

                </div>
                <div id="geci">
                    <h3 align="center">一起去看风和日丽</h3>
                    <br>

                    <p align="center">歌手：奚缘</p>
                    <p align="center">专辑;ssss </p>
                    <br>
                    <div id="song">
                        <p align="center">你说你生活很累<br>
                            每天过得很疲惫<br>
                            我没有感同身受所以无法对你安慰<br>
                            不如跟我走<br>
                            带你去兜风<br>
                            放下那一切<br>
                            让你所悲伤的事<br>
                            我这人没心没肺<br>
                            没谁能将我击溃<br>
                            我独自珍藏的快乐就已经有一大堆<br>
                            不如相信我<br>
                            别在意结果<br>
                            这世界有很多的美好等待你去探索<br>
                            转 转 转 我们转遍整个游乐园<br>
                            看 看 看 一整天都泡在电影院<br>
                            拍 拍 拍 拍满手机内存的相片<br>
                            玩 玩 玩 一直不断断断<br>
                            地去寻找 梦想和美好 能打败了烦恼 wow<br>
                            你 说你喜欢猫 我带你去猫咖<br>
                            爱 围绕你身边 等待你去发现<br>
                            看 这世界 只要再多用心一点<br>
                            只要你需要我时我都在<br>
                            尽管在微信上call me<br>
                            如果没接请等待<br>
                            我肯定不是不想回你<br>
                            相信你自己的存在<br>
                            一定被赋予意义<br>
                            在未来成为了人才<br></p>
                    </div>
                </div>
            </div>
        </div> 
        <div id="footer">
            <div id="footerleft">
                <img src="./img/05.png" alt="">
            </div>
            <div id="geshou">
                <p class="geshou">一起去看风和日丽 - 奚缘</p>
            </div>
            <div id="tubiao">
                <span><i class="iconfont" id="wunai">&#xe6cf;</i></span>
                <span><i class="iconfont" id="shangyishou">&#xe607;</i></span>
                <span><i class="iconfont" id="zanting">&#xe60a;</i></span>
                <span><i class="iconfont" id="xiayishou">&#xe606;</i></span>
                <span><i class="iconfont" id="bobiao">&#xea71;</i></span>
            </div>
            <div id="jindu">
                <div id="jindutiao">
                    <span>0:00</span>
                    <div class="progress" id="progress-bar">
                        <div class="bar" id="bar01"></div>
                        <div class="dot" id="dot01"></div>
                    </div>
                    <span>0:00</span>
                </div>
                <div id="shengyin">
                    <span><i class="iconfont">&#xeca5;</i></span>
                    <div class="progress" id="music-bar">
                        <div class="bar" id="bar02"></div>
                        <div class="dot" id="dot02"></div>
                    </div>
                </div>
            </div>
        </div>
        <div id="bofangliebiao">
            <audio src="./img/001.mp3" id="audio" autoplay data-num="0"></audio>
            <select name="" id="select" multiple>
                <option value="0" selected>一起去看风和日丽 - 奚缘</option>
                <option value="1">半岛铁盒 -周杰伦 </option>
                <option value="2">20岁少年和他的宇宙 - 水水水水</option>
                <option value="3">猫和老鼠 - 傻厄尔</option>
        </div>

    </div>

    <script type="text/javascript" src="./JS/lun.js"></script>
    <script type="text/javascript" src="./JS/huan.js"></script>
    <script type="text/javascript" src="./JS/stop.js"></script>

</body>

</html>